// *******************************************************************************************************
// # タイトル
// *******************************************************************************************************

// タイトル
//
// #### export common.css
// ※このページでは表示が完全に再現されず、部分的に崩れている場合があります。  
// ※class名やデザインの参考まで
//
// Styleguide 2.0

/* ------------------------------------
	* タイトル
* ------------------------------------ */


// メインタイトル→エリア・路線検索など
//
// .mod_ttl_bar.mod_ttl_bar_blue - ブルー
// .mod_ttl_bar.mod_ttl_bar_khaki - カーキ
// .mod_ttl_bar.mod_ttl_bar_pink - ピンク
//
// Markup:
// <h1 class="{$modifiers}">東京ディズニーランド・ステーションの賃貸情報</h1>
//
// Styleguide 2.1

// メインタイトル：サブリンク付き→エリア・路線検索など
//
// .mod_ttl_bar_sublink - sample
//
// Markup:
// <div class="mod_ttl_bar_sublink">
// <h1 class="mod_ttl_bar mod_ttl_bar_blue">東京ディズニーランド・ステーションの賃貸情報</h1>
// <p class="txt_sublink"><a href="#dummy" class="mod_link_arrow mod_link_arrow_white">通勤通学時間から探す</a></p>
// </div>
//
// Styleguide 2.2

/* --------------------------
	* mod_ttl_bar
* -------------------------- */
.mod_ttl_bar {
	margin-bottom: 16px;
	padding: 0 14px;
	padding-top: 14px;
	padding-bottom: 6px;
	@include border-radius(8px);
	min-height: 30px;
	position: relative;
	font-size: 20px;
	font-weight: bold;
}

.mod_ttl_bar_blue {
	color: #fff;
	background-color: $bgColorBlue;
}

.mod_ttl_bar_khaki {
	color: $textColor;
	background-color: $bgColorKhakiTitle;
}

.mod_ttl_bar_pink {
	color: $textColor;
	background-color: $bgColorPinkChecked;
}

.mod_ttl_bar_check {
	padding: 0 10px;
	padding-top: 11px;
	padding-bottom: 9px;

	&.mod_checked {
		background-color: $bgColorPinkChecked;
	}
}

/* --------------------------
	* mod_ttl_bar_sublink
* -------------------------- */
.mod_ttl_bar_sublink {
	position: relative;
}

.txt_sublink {
	margin-top: -0.7em;
	position: absolute;
	right: 20px;
	top: 50%;
	color: #fff;

	@include hack(6) {
		top: 24px;
	}
	@include hack(7) {
		top: 35%;
	}
}


// ページタイトル
//
// .mod_ttl_page - sample
//
// Markup:
// <h1 class="mod_ttl_page">最近見た物件</h1>
//
// Styleguide 2.3

/* --------------------------
	* mod_ttl_page
* -------------------------- */
.mod_ttl_page {
	margin-top: 14px;
	padding-top: 14px;
	color: $textColorBlue;
	font-size: 36px;
	font-weight: bold;
}

